<section id="projectConfig" class="ml-24 mr-24 ptb-20">
	<div class="image-up"></div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="required">*</span>
			<span class="color-666">项目名：</span>
		</div>
		<div class="dy-fx-5">
			<input type="text" class="form-control" v-model="data.projectName">
		</div>
		<div class="dy-fx-6"></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="required">*</span>
			<span class="color-666">项目状态：</span>
		</div>
		<div class="dy-fx-5">
			<div class="select-ul" style="width: 120px;">
				<span class="select-name br-4 box-i-shadow" ref="proejctStatus">请选择</span>
			  <ul>
			    <li v-for="item in proejctStatusList" @click="setProjectStatus(item)">{{ item.name }}</li>
			  </ul>
			</div>
		</div>
		<div class="dy-fx-6"></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="visibility">*</span>
			<span class="color-666">项目法定名称：</span>
		</div>
		<div class="dy-fx-5">
			<input type="text" class="form-control" v-model="data.projectFdName">
		</div>
		<div class="dy-fx-6"></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="required">*</span>
			<span class="color-666">关联公司：</span>
		</div>
		<div class="dy-fx-5">
			<div class="select-ul">
				<span class="select-name br-4 box-i-shadow" ref="selCompany">请选择</span>
			  <ul>
			    <li v-for="item in companysList" @click="setCompany(item)">{{ item.shortName }}</li>
			  </ul>
			</div>
		</div>
		<div class="dy-fx-6"></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="required">*</span>
			<span class="color-666">项目所在地：</span>
		</div>
		<div class="dy-fx-5 dy-flex" style="justify-content: space-between;">
			<div class="select-ul" style="width: 120px;">
				<span class="select-name br-4 box-i-shadow" ref="provinceSel">省</span>
			  <ul>
			    <li v-for="item in provinceList" @click="setProvince(item)">{{ item.name }}</li>
			  </ul>
			</div>
			<div class="select-ul" style="width: 120px;">
				<span class="select-name br-4 box-i-shadow" ref="citySel">市</span>
			  <ul>
			    <li v-for="item in cityList" @click="setCity(item)">{{ item.name }}</li>
			  </ul>
			</div>
			<div class="select-ul" style="width: 120px;">
				<span class="select-name br-4 box-i-shadow" ref="areaSel">区</span>
			  <ul>
			    <li v-for="item in areaList" @click="setArea(item)">{{ item.name }}</li>
			  </ul>
			</div>
		</div>
		<div class="dy-fx-6"></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="required">*</span>
			<span class="color-666">详细地址：</span>
		</div>
		<div class="dy-fx-5">
			<input type="text" class="form-control" v-model="data.address">
		</div>
		<div class="dy-fx-6"></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="required">*</span>
			<span class="color-666">地理位置：</span>
		</div>
		<div class="dy-fx-5">
			<div id="mapGaode" style="width: 369px;height: 280px;"></div>
			<div class="mt-10">
				<hl-button @on-click="showNewMap">手动定位</hl-button>
				<hl-button @on-click="newMap">更新定位</hl-button>
			</div>
		</div>
		<div class="dy-fx-6"></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="required">*</span>
			<span class="color-666">项目预览图：</span>
		</div>
		<div class="dy-fx-5">
			<div v-if="!data.imgUrl">
				<hl-button @on-click="updateImg">上传图片</hl-button>
			</div>
			<div class="relative" style="width: 228px;height: 171px;" v-if="data.imgUrl">
				<img :src="data.imgUrl + '?w=700&h=600'" alt="预览图" style="width: 228px;height: 171px;background-color: #eee;display: block;" />
				<div class="absolute text-center cursor" @click="updateImg" style="bottom: 0;left: 0;width: 100%;height: 32px;line-height: 32px;background-color: rgba(0,0,0,.4);color: #fff;">重新上传</div>
			</div>
		</div>
		<div class="dy-fx-6"></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="visibility">*</span>
			<span class="color-666">占地面积：</span>
		</div>
		<div class="dy-fx-5">
			<input type="text" class="form-control" v-model="data.zdAreage">
		</div>
		<div class="dy-fx-6 line-height-34"><span class="ml-10">m²</span></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="visibility">*</span>
			<span class="color-666">建筑面积：</span>
		</div>
		<div class="dy-fx-5">
			<input type="text" class="form-control" v-model="data.jzAreage">
		</div>
		<div class="dy-fx-6 line-height-34"><span class="ml-10">m²</span></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="visibility">*</span>
			<span class="color-666">可出租面积：</span>
		</div>
		<div class="dy-fx-5">
			<input type="text" class="form-control" v-model="data.czAreage">
		</div>
		<div class="dy-fx-6 line-height-34"><span class="ml-10">m²</span></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="visibility">*</span>
			<span class="color-666">项目产权人：</span>
		</div>
		<div class="dy-fx-5">
			<input type="text" class="form-control" v-model="data.owner">
		</div>
		<div class="dy-fx-6"></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="visibility">*</span>
			<span class="color-666">联系人信息：</span>
		</div>
		<div class="dy-fx-8">
			<input type="text" class="form-control inline" placeholder="请输入姓名" style="width: 100px;" v-model="data.name">
			<input type="number" class="form-control inline ml-10"  placeholder="请输入联系方式" style="width: 150px;" v-model="data.phone">
		</div>
		<div class="dy-fx-3"></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="visibility">*</span>
			<span class="color-666">权益系数：</span>
		</div>
		<div class="dy-fx-5">
			<input type="text" class="form-control" v-model="data.equity">
		</div>
		<div class="dy-fx-6 line-height-34"><span class="ml-10">%</span></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="visibility">*</span>
			<span class="color-666">土地使用权到期日：</span>
		</div>
		<div class="dy-fx-5 project-calendar-container">
			<web-calendar type="primary" v-model="data.tdTime" tips="请选择日期"></web-calendar>
		</div>
		<div class="dy-fx-6"></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="visibility">*</span>
			<span class="color-666">加入物业组合日期：</span>
		</div>
		<div class="dy-fx-5 project-calenda-container">
			<web-calendar type="primary" v-model="data.wyTime" tips="请选择日期"></web-calendar>
		</div>
		<div class="dy-fx-6"></div>
	</div>
	<div class="dy-flex mt-10">
		<div class="dy-fx-2 line-height-34">
			<span class="visibility">*</span>
			<span class="color-666">物业概况：</span>
		</div>
		<div class="dy-fx-5">
			<textarea rows="3" class="form-control" v-model="data.survey">

			</textarea>
		</div>
		<div class="dy-fx-6"></div>
	</div>

	<div class="ml-10 pt-15" v-if="istsFlag == 'Y'">
		<hl-checkbox :data="selectedData" v-model="tsflag"></hl-checkbox>
	</div>

	<div class="select-company mt-15 border-b pb-20">
		<div class="font-16 cursor company-luitll" @click="showCompanyTab" :class="{'config-company': !showCompany, 'icon-Gm-confirm': showCompany, 'color-primary': showCompany}"><span class="visibility">*</span><span class="color-666">配置项目公司</span></div>
	</div>
	<div class="project-company pt-10" v-if="showCompany">

		<div class="dy-flex mt-10">
			<div class="dy-fx-2 line-height-34">
				<span class="visibility">*</span>
				<span class="color-666">项目公司全称：</span>
			</div>
			<div class="dy-fx-5">
				<input type="text" class="form-control" v-model="data.pcompany">
			</div>
			<div class="dy-fx-6"></div>
		</div>
		<div class="dy-flex mt-10">
			<div class="dy-fx-2 line-height-34">
				<span class="visibility">*</span>
				<span class="color-666">法人：</span>
			</div>
			<div class="dy-fx-5">
				<input type="text" class="form-control" v-model="data.fpersonName">
			</div>
			<div class="dy-fx-6"></div>
		</div>
		<div class="dy-flex mt-10">
			<div class="dy-fx-2 line-height-34">
				<span class="visibility">*</span>
				<span class="color-666">注册地址：</span>
			</div>
			<div class="dy-fx-5">
				<input type="text" class="form-control" v-model="data.companyRegistAddress">
			</div>
			<div class="dy-fx-6"></div>
		</div>
		<div class="dy-flex mt-10">
			<div class="dy-fx-2 line-height-34">
				<span class="visibility">*</span>
				<span class="color-666">联系人：</span>
			</div>
			<div class="dy-fx-5">
				<input type="text" class="form-control" v-model="data.companyContactName">
			</div>
			<div class="dy-fx-6"></div>
		</div>
		<div class="dy-flex mt-10">
			<div class="dy-fx-2 line-height-34">
				<span class="visibility">*</span>
				<span class="color-666">联系方式：</span>
			</div>
			<div class="dy-fx-5">
				<input type="text" class="form-control" v-model="data.companyContactPhone">
			</div>
			<div class="dy-fx-6"></div>
		</div>
		<div class="dy-flex mt-10">
			<div class="dy-fx-2 line-height-34">
				<span class="visibility">*</span>
				<span class="color-666">运营管理方：</span>
			</div>
			<div class="dy-fx-5">
				<input type="text" class="form-control" v-model="data.companyManager">
			</div>
			<div class="dy-fx-6"></div>
		</div>
		<h3 class="font-16 color-666 font-nm pb-10"><span class="visibility">*</span>收款信息</h3>

		<div v-for="(item, index) in data.bankInfos" class="ptb-10 mt-10" style="border-top: 1px dashed #ddd;">
			<div class="dy-flex mt-10">
				<div class="dy-fx-2 line-height-34">
					<span class="visibility">*</span>
					<span class="color-666">账户名称：</span>
				</div>
				<div class="dy-fx-5">
					<input type="text" class="form-control" v-model="item.name">
				</div>
				<div class="dy-fx-6"></div>
			</div>
			<div class="dy-flex mt-10">
				<div class="dy-fx-2 line-height-34">
					<span class="visibility">*</span>
					<span class="color-666">公司开户行：</span>
				</div>
				<div class="dy-fx-5">
					<input type="text" class="form-control" v-model="item.account">
				</div>
				<div class="dy-fx-6 line-height-34">
					<span class="cursor ml-10" v-if="data.bankInfos.length > 1" @click="delBank(index)">
						<span class="icon-Gm-delete"></span> 删除
					</span>
				</div>
			</div>
			<div class="dy-flex mt-10">
				<div class="dy-fx-2 line-height-34">
					<span class="visibility">*</span>
					<span class="color-666">开户账号：</span>
				</div>
				<div class="dy-fx-5">
					<input type="text" class="form-control" @blur="bankAccountValidate(index)" v-model="item.bankAccount">
				</div>
				<div class="dy-fx-6"></div>
			</div>
		</div>

		<div class="color-primary mt-10 cursor" @click="addBanks"><span class="icon-Org-account"></span> 新建收款信息</div>
	</div>
	<div class="mt-15 pt-15">
		<hl-button @on-click="addProject" v-if=" !projectId" type="primary">确认创建</hl-button>
		<hl-button @on-click="editProject" v-if=" projectId && auth.indexOf('c21') > -1" type="primary">保存</hl-button>
	</div>

	<div class="manual-postion" v-if="manualFlag">
		<div class="manual-wrap br-4">
			<div class="title text-center">手动定位</div>
			<span class="close icon-Gm-close text-center" @click="hideNewMap"></span>
			<div id="newGaode" class="bg-F8FAFF" style="width: 600px; height: 300px;"></div>
			<div style="margin: 8px 0;" class="text-center">
				<button type="button" class="btn n-btn-primary" @click="usePosition">使用当前定位</button>
			</div>
		</div>
	</div>
</section>

<style type="text/css">
	.visibility {
		visibility: hidden;
	}
	.company-luitll {
		position: relative;
		padding-left: 25px;
	}
	.config-company:before {
		content: '';
		width: 16px;
		height: 16px;
		border-radius: 4px;
		border: 1px solid #ddd;
	}
	.company-luitll:before {
		position: absolute;
		top: 2px;
		left: 5px;
	}
	.amap-icon img {
		width: 25px;
		height: 34px;
	}
	.amap-logo,.amap-copyright{
		display: none !important;
	}
	.manual-postion {
		position: fixed;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0,0,0,.5);
		display: flex;
		justify-content: center;
		align-items: center;
		z-index: 999;
	}
	.manual-wrap {
		position: relative;
		background: #fff;
		width: 600px;
	}
	.manual-wrap .title {
		line-height: 45px;
		height: 45px;
	}
	.manual-wrap .close {
		position: absolute;
		right: 0;
		top: 0;
		width: 45px;
		height: 45px;
		font-size: 14px;
		line-height: 45px;
	}

	input::-webkit-outer-spin-button,
	input::-webkit-inner-spin-button {
			-webkit-appearance: none;
	}
	input[type="number"]{
			-moz-appearance: textfield;
	}
</style>
<script src="modules/projectConfig/scripts/projectConfigIndex.js" charset="utf-8"></script>
